<!DOCTYPE html>
<html lang="ch-CN">
<head>
    <meta charset="UTF-8">
    <title>for-三角形</title>
</head>
<style>
    body {
        width: 100%;
        height: 100vh;
        background-color: wheat;
        font-size: 30px;
        text-decoration: none;
        font-family: "华文楷体";
    }
    span{
        display: inline-block;
        width: 120px;
    }
</style>
<body>
</body>
<script>
    // 矩形
    for (let i = 0; i < 5; i++) {
        for (let j = 0; j < 5; j++) {
            document.write("*")
        }
        document.write("<br>")
    }
    // 直角三角形

    for (let i = 0; i <= 5; i++) {
        for (let j = 0; j <= i; j++) {
            document.write("&nbsp;&nbsp;"+"*" + "&nbsp;&nbsp;")
        }
        document.write("<br>")
    }

    // 等腰三角形
    for (let i = 0; i < 5; i++) {
        for (let j = 0; j < 5 - i; j++) {
            document.write("&nbsp;&nbsp;")
        }
        for (let j = 0; j <= i; j++) {
            document.write(" * " + "&nbsp;")
        }
        document.write("<br>")
    }
    // 9*9乘法表
    for (let i=1;i<=9;i++){
        for (let j=1;j<=i;j++){
            // 使3*3和3*4对齐下面的列 方法一:给span设置css样式
            document.write("<span>"+j+"*"+i+"="+i*j+"</span>")
            // 使3*3和3*4对齐下面的列 方法二:
            // document.write(j+"*"+i+"="+i*j+"&nbsp;&nbsp;")
            // if ((j===2&&i===3)||(j===2&&i===4)){
            //     document.write("&nbsp;&nbsp;")
            // }
        }
        document.write("<br>")
    }
</script>
</html>